<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>biaoti</title>
</head>
<body>
    <div>hello1</div>
    <div>hello2</div>
    <p class="text">Hello1</p>
    <p class="text">hello2</p>
    
    <script>
        var div1 = document.getElementsByTagName("div")[0]
        console.log(div1); // 获取所有div标签 
        div1.innerHTML = "Hello World"; // 修改div1的内容
        var p = document.getElementsByClassName("text"); // 获取class为text的p标签
        console.log(p);
        p[0].innerHTML = "Hello World1"; // 修改p标签的内容
        p[1].innerHTML = "Hello World2"; // 修改p标签的内容
        var p1 = document.querySelector(".text"); // 获取第一个class为text的p标签
        console.log(p1);
        p1.color = "red"; // 修改p1的颜色属性
    </script>

</body>
</html>